<template>
  <d2-container>
    <el-breadcrumb separator-class="el-icon-arrow-right">
      <div class="d2-breadcrumb">
        <el-breadcrumb-item>公告管理</el-breadcrumb-item>
        <el-breadcrumb-item>新增公告</el-breadcrumb-item>
      </div>
    </el-breadcrumb>
    <el-form label-width="100px" :model="query" :rules="rules" ref="add">
      <el-form-item label="公告标题" prop="title">
        <el-input v-model="query.title" style="width: 240px"></el-input>
      </el-form-item>
      <el-form-item label="开启时间" prop="time">
        <el-date-picker
          v-model="query.time"
          type="datetime"
          placeholder="选择日期"
          value-format="timestamp"
        >
        </el-date-picker>
      </el-form-item>
      <el-form-item label="公告状态">
        <el-switch v-model="query.status"></el-switch>
      </el-form-item>
      <el-form-item label="公告内容" prop="content">
        <el-input
          v-model="query.content"
          style="width: 240px"
          type="textarea"
        ></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="add">保存</el-button>
      </el-form-item>
    </el-form>
  </d2-container>
</template>
<script>
export default {
  data() {
    return {
      query: {},
      rules: {
        title: [{ required: true, message: "标题不能为空", trigger: "blur" }],
        time: [{ required: true, message: "日期不能为空", trigger: "blur" }],
        content: [{ required: true, message: "内容不能为空", trigger: "blur" }],
      },
    };
  },
  methods: {
    add() {
      this.$refs["add"].validate((valid) => {
        if (valid) {
          let params = {
            ...this.query,
          };
          if (params.time) {
        params.time = new Date(
          Date.parse(new Date(params.time)) + 8 * 3600 * 1000
        );
      }
          console.log("提交内容：", params);
          this.$axios.post("/admin/addNote", params).then((result) => {
            if (!result) {
              this.$message.success("操作成功");
              this.$router.push("/notes");
              this.$refs["add"].resetFields();
            } else {
              this.$message.error(result.data.msg);
            }
          });
        } else {
          return false;
        }
      });
    },
  },
};
</script>